<template>
  <view class="paymentPassword">
    <topTitle />
    <view class="com">
      <view>修改登錄密碼</view>
    </view>
    <view class="ipts">
      <view>
        <view>原密碼</view>
        <view>
          <up-input
            placeholder="請輸入原密碼"
            border="none"
            v-model="pass_word3"
            clearable
            :password="!showPsw3"
          >
            <template #suffix>
              <i
                @tap="showPsw3 = !showPsw3"
                :class="showPsw3 ? 'open' : 'eye'"
              ></i>
            </template>
          </up-input>
        </view>
      </view>
      <view>
        <view>新密碼</view>
        <view>
          <up-input
            placeholder="請輸入新密碼"
            border="none"
            v-model="pass_word"
            clearable
            :password="!showPsw"
          >
            <template #suffix>
              <i
                @tap="showPsw = !showPsw"
                :class="showPsw ? 'open' : 'eye'"
              ></i>
            </template>
          </up-input>
        </view>
      </view>
      <view>
        <view>確認密碼</view>
        <view>
          <up-input
            placeholder="請再次輸入确认密碼"
            border="none"
            v-model="pass_word2"
            clearable
            :password="!showPsw2"
          >
            <template #suffix>
              <i
                @tap="showPsw2 = !showPsw2"
                :class="showPsw2 ? 'open' : 'eye'"
              ></i>
            </template>
          </up-input>
        </view>
      </view>
    </view>
    <view class="btn">
      <up-button
        :disabled="!(pass_word && pass_word2 && pass_word3)"
        text="确认修改"
        @tap="PwUpdateFn"
        type="primary"
      ></up-button>
    </view>
  </view>
</template>

<script setup lang="ts">
import { ref, getCurrentInstance } from "vue";
import { PaymentPwSet, LogOut, PwUpdate } from "@/api/UserApi";
const instance = getCurrentInstance()?.appContext.config.globalProperties;

let showPsw = ref<boolean>(false);
let showPsw2 = ref<boolean>(false);
let showPsw3 = ref<boolean>(false);
let pass_word = ref<string>();
let pass_word2 = ref<string>();
let pass_word3 = ref<string>();
const PaymentPwSetFn = async () => {
  if (pass_word.value != pass_word2.value) {
    uni.showToast({
      title: "两次密码输入不一致",
      icon: "none",
    });
    return;
  }

  await PaymentPwSet({
    pass_word: instance?.getRsaCode(pass_word.value),
  });
  initFn();
};

const PwUpdateFn = async () => {
  if (pass_word.value != pass_word2.value) {
    uni.showToast({
      title: "两次密码输入不一致",
      icon: "none",
    });
    return;
  }

  await PwUpdate({
    pass_word: instance?.getRsaCode(pass_word3.value),
    new_pass_word: instance?.getRsaCode(pass_word.value),
  });
  initFn();
};

const initFn = async () => {
  pass_word.value = "";
  pass_word2.value = "";
  pass_word3.value = "";
  uni.showToast({
    title: "修改成功",
    icon: "none",
  });

  LogOut();
};
</script>
<style scoped lang="scss">
@import "../../static/scss/pay.scss";
</style>
